<template>
	<view class="banner">
		<view>
			<swiper class="imges" indicator-dots indicator-color="rgba(255, 255, 255, 0.3)" indicator-active-color="#ffffff" autoplay circular>
				<swiper-item v-for="item in bannlist" :key="item._id" class="item">
					<image :src="item.bannerfile.path" mode="aspectFill"></image>
				</swiper-item>
			</swiper>
		</view>
	</view>
</template>

<script setup>
import { ref } from 'vue';
const bannlist = ref([]);
const db = uniCloud.database();
const bannerget = () => {
	db.collection('opendb-banner')
		.get()
		.then((res) => {
			bannlist.value = res.result.data;
		})
		.catch((err) => {});
};
bannerget();
</script>

<style lang="scss" scoped>
.banner {
	width: 750rpx;
	padding: 30rpx 0;

	.imges {
		width: 750rpx;
		height: 340rpx;

		.item {
			width: 100%;
			height: 100%;
			padding: 0 30rpx;

			image {
				width: 100%;
				height: 100%;
				border-radius: 15rpx;
			}
		}
	}
}
</style>
